<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width, initial-scale=1.0">
		<meta http-equiv="X-UA-Compatible" content="IE=edge">
		<title>AutoTest | 主页</title>

		<!-- Header Start -->
		<!-- JS -->
		<!-- Mainly scripts -->
		<script src="js/jquery-3.1.1.min.js"></script>
		<script src="js/plugins/jasny/jasny-bootstrap.min.js"></script><!-- Jasny -->
		<script src="js/popper.min.js"></script>
		<script src="js/bootstrap.js"></script>
		<script src="js/plugins/metisMenu/jquery.metisMenu.js"></script>
		<script src="js/plugins/slimscroll/jquery.slimscroll.min.js"></script>
		<!-- Flot -->
		<script src="js/plugins/flot/jquery.flot.js"></script>
		<script src="js/plugins/flot/jquery.flot.tooltip.min.js"></script>
		<script src="js/plugins/flot/jquery.flot.spline.js"></script>
		<script src="js/plugins/flot/jquery.flot.resize.js"></script>
		<script src="js/plugins/flot/jquery.flot.pie.js"></script>
		<!-- Peity -->
		<script src="js/plugins/peity/jquery.peity.min.js"></script>
		<script src="js/demo/peity-demo.js"></script>
		<!-- Custom and plugin javascript -->
		<script src="js/inspinia.js"></script>
		<script src="js/plugins/pace/pace.min.js"></script>
		<!-- jQuery UI -->
		<script src="js/plugins/jquery-ui/jquery-ui.min.js"></script>
		<!-- GITTER -->
		<script src="js/plugins/gritter/jquery.gritter.min.js"></script>
		<!-- Sparkline -->
		<script src="js/plugins/sparkline/jquery.sparkline.min.js"></script>
		<!-- Sparkline demo data  -->
		<script src="js/demo/sparkline-demo.js"></script>
		<!-- ChartJS-->
		<script src="js/plugins/chartJs/Chart.min.js"></script>
		<!-- Toastr -->
		<script src="js/plugins/toastr/toastr.min.js"></script>
		<!-- Sweet alert -->
		<script src="js/plugins/sweetalert/sweetalert.min.js"></script>
		<script src="js/plugins/dataTables/datatables.min.js"></script>
		<script src="js/plugins/dataTables/dataTables.bootstrap4.min.js"></script>
		<!-- Chosen -->
		<script src="js/plugins/chosen/chosen.jquery.js"></script>
		<!-- 主题 -->
		<script src="js/theme.js" type="text/javascript" charset="utf-8"></script>
		<!-- 自定义的js -->
		<script src="js/autotest.js" type="text/javascript" charset="utf-8"></script>
		
		<!-- CSS -->
		<link rel="shortcut icon" href="img/favicon.png" type="image/x-icon">
		<link href="css/plugins/jasny/jasny-bootstrap.min.css" rel="stylesheet">
		<link href="css/bootstrap.min.css" rel="stylesheet">
		<link href="font-awesome/css/font-awesome.css" rel="stylesheet">
		<link href="css/plugins/toastr/toastr.min.css" rel="stylesheet">
		<link href="js/plugins/gritter/jquery.gritter.css" rel="stylesheet">
		<link href="css/animate.css" rel="stylesheet">
		<link href="css/style.css" rel="stylesheet">
		<link href="css/plugins/sweetalert/sweetalert.css" rel="stylesheet">
		<link href="css/plugins/dataTables/datatables.min.css" rel="stylesheet">
		<link href="css/plugins/chosen/bootstrap-chosen.css" rel="stylesheet">
		<link rel="stylesheet" type="text/css" href="css/autotest.css" />
		<!-- Header End -->
	</head>

	<body>
		<div id="wrapper">
			<nav class="navbar-default navbar-static-side" role="navigation">
				<div class="sidebar-collapse">
					<ul class="nav metismenu" id="side-menu">
						<li class="nav-header">
							<div class="dropdown profile-element">
								<img alt="image" class="rounded-circle" src="img/profile_small.jpg" />
								<a data-toggle="dropdown" class="dropdown-toggle" href="#">
									<span class="block m-t-xs font-bold">Admin</span>
									<span class="text-muted text-xs block">管理台 <b class="caret"></b></span>
								</a>
								<ul class="dropdown-menu animated fadeInRight m-t-xs">
									<li><a class="dropdown-item" href="profile.html">个人信息</a></li>
									<li class="dropdown-divider"></li>
									<li><a class="dropdown-item" href="login.html">登出</a></li>
								</ul>
							</div>
							<div class="logo-element">
								IN+
							</div>
						</li>

						<!-- 首页 -->
						<li class="active">
							<a href="index.html"><i class="fa fa-home"></i> <span class="nav-label">首页</span></a>
						</li>

						<!-- 产品列表 -->
						<li>
							<a href="#"><i class="fa fa-th-list"></i> <span class="nav-label">产品列表</span> <span class="fa arrow"></span></a>
							<ul id="productlist" class="nav nav-second-level">
								<li><a href="#" data-toggle="modal" data-target="#productCreateModal">创建一个新产品</a></li>
								<li><a href="#">模板</a></li>
								<li><a href="#">模板</a></li>
							</ul>
						</li>

				</div>
			</nav>

			<div id="page-wrapper" class="gray-bg dashbard-1">

				<!-- 顶部导航栏 -->
				<div class="row border-bottom">
					<nav class="navbar navbar-static-top" role="navigation" style="margin-bottom: 0">

						<!-- 左侧 -->
						<div class="navbar-header">
							<a class="navbar-minimalize minimalize-styl-2 btn btn-primary " href="#"><i class="fa fa-bars"></i> </a>
							<form role="search" class="navbar-form-custom" action="search_results.html">
								<div class="form-group">
									<input type="text" placeholder="请输入搜索内容(暂未实现)" class="form-control" name="top-search" id="top-search">
								</div>
							</form>
						</div>

						<!-- 右侧 -->
						<ul class="nav navbar-top-links navbar-right">
							<!-- 欢迎 -->
							<li style="padding: 20px">
								<span class="m-r-sm text-muted welcome-message">欢迎使用AutoTest</span>
							</li>

							<!-- 信箱 -->
							<li class="dropdown">
								<a class="dropdown-toggle count-info" data-toggle="dropdown" href="#">
									<i class="fa fa-envelope"></i> <span class="label label-warning">1</span>
								</a>
								<ul class="dropdown-menu dropdown-messages dropdown-menu-right">
									<!-- 内容块 -->
									<li>
										<div class="dropdown-messages-box">
											<a class="dropdown-item float-left" href="profile.html">
												<img alt="image" class="rounded-circle" src="img/a7.jpg">
											</a>
											<div class="media-body">
												<small class="float-right text-navy">2 小时前</small>
												<strong>小明</strong> 评论了 <strong>小红</strong>. <br>
												<small class="text-muted">2017.10.06 7:58</small>
											</div>
										</div>
									</li>
									<!-- 分割线 -->
									<li class="dropdown-divider"></li>
									<!-- 清除所有 -->
									<li>
										<div class="text-center link-block">
											<a href="mailbox.html" class="dropdown-item">
												<i class="fa fa-envelope"></i> <strong>标记所有消息已阅读</strong>
											</a>
										</div>
									</li>
								</ul>
							</li>

							<!-- 提醒 -->
							<li class="dropdown">
								<a class="dropdown-toggle count-info" data-toggle="dropdown" href="#">
									<i class="fa fa-bell"></i> <span class="label label-primary">8</span>
								</a>
								<ul class="dropdown-menu dropdown-alerts">
									<!-- 内容快 -->
									<li>
										<a href="profile.html" class="dropdown-item">
											<div>
												<i class="fa fa-twitter fa-fw"></i> 提醒信息。。。
												<span class="float-right text-muted small">10分钟前</span>
											</div>
										</a>
									</li>
									<!-- 分割线 -->
									<li class="dropdown-divider"></li>
									<!-- 清除所有 -->
									<li>
										<div class="text-center link-block">
											<a href="notifications.html" class="dropdown-item">
												<strong>查看所有信息</strong>
												<i class="fa fa-angle-right"></i>
											</a>
										</div>
									</li>
								</ul>
							</li>

							<!-- 注销 -->
							<li>
								<a href="login.html">
									<i class="fa fa-sign-out"></i> 注销
								</a>
							</li>
						</ul>

					</nav>

				</div>

				<!-- 主体内容区 -->
				<div class="row border-bottom white-bg dashboard-header">
					<div class="row col-md-12">
						<h2>这里进行首页介绍</h2>
					</div>
					<div class="row col-md-12">
						TODO
					</div>
				</div>

				<!-- 页脚 -->
				<div class="footer">
					<div class="float-right">
						<strong>2.9 inspinia</strong>
					</div>
					<div>
						<strong>Copyright</strong> inspinia 2.9 &copy; 2014-2018
					</div>
				</div>
			</div>

		</div>
		<script>
			$(document).ready(function() {
            setTimeout(function() {
                toastr.options = {
                    closeButton: true,
                    progressBar: true,
                    showMethod: 'slideDown',
                    timeOut: 4000
                };
                toastr.success('AutoTest', '欢迎使用');

            }, 1300);
        });
		</script>

		<!--模板配置-->
		<div class="theme-config">
			<div class="theme-config-box">
				<div class="spin-icon">
					<i class="fa fa-cogs fa-spin"></i>
				</div>

				<div class="skin-settings">
					<!-- title -->
					<div class="title">配置 <br>
						<small style="text-transform: none;font-weight: 400">
							更改样式
						</small>
					</div>
					<!-- 折叠菜单 -->
					<div class="setings-item">
						<span>
							折叠菜单
						</span>

						<div class="switch">
							<div class="onoffswitch">
								<input type="checkbox" name="collapsemenu" class="onoffswitch-checkbox" id="collapsemenu">
								<label class="onoffswitch-label" for="collapsemenu">
									<span class="onoffswitch-inner"></span>
									<span class="onoffswitch-switch"></span>
								</label>
							</div>
						</div>
					</div>
					<!-- 固定侧边栏 -->
					<div class="setings-item">
						<span>
							固定侧边栏
						</span>

						<div class="switch">
							<div class="onoffswitch">
								<input type="checkbox" name="fixedsidebar" class="onoffswitch-checkbox" id="fixedsidebar">
								<label class="onoffswitch-label" for="fixedsidebar">
									<span class="onoffswitch-inner"></span>
									<span class="onoffswitch-switch"></span>
								</label>
							</div>
						</div>
					</div>
					<!-- 顶级导航栏 -->
					<div class="setings-item">
						<span>
							顶级导航栏
						</span>

						<div class="switch">
							<div class="onoffswitch">
								<input type="checkbox" name="fixednavbar" class="onoffswitch-checkbox" id="fixednavbar">
								<label class="onoffswitch-label" for="fixednavbar">
									<span class="onoffswitch-inner"></span>
									<span class="onoffswitch-switch"></span>
								</label>
							</div>
						</div>
					</div>
					<!-- 顶部导航栏V.2 -->
					<div class="setings-item">
						<span>
							顶部导航栏V.2
							<br>
							<small>*主要布局</small>
						</span>

						<div class="switch">
							<div class="onoffswitch">
								<input type="checkbox" name="fixednavbar2" class="onoffswitch-checkbox" id="fixednavbar2">
								<label class="onoffswitch-label" for="fixednavbar2">
									<span class="onoffswitch-inner"></span>
									<span class="onoffswitch-switch"></span>
								</label>
							</div>
						</div>
					</div>
					<!-- 盒子布局 -->
					<div class="setings-item">
						<span>
							盒子布局
						</span>

						<div class="switch">
							<div class="onoffswitch">
								<input type="checkbox" name="boxedlayout" class="onoffswitch-checkbox" id="boxedlayout">
								<label class="onoffswitch-label" for="boxedlayout">
									<span class="onoffswitch-inner"></span>
									<span class="onoffswitch-switch"></span>
								</label>
							</div>
						</div>
					</div>
					<!-- 固定页脚 -->
					<div class="setings-item">
						<span>
							固定页脚
						</span>

						<div class="switch">
							<div class="onoffswitch">
								<input type="checkbox" name="fixedfooter" class="onoffswitch-checkbox" id="fixedfooter">
								<label class="onoffswitch-label" for="fixedfooter">
									<span class="onoffswitch-inner"></span>
									<span class="onoffswitch-switch"></span>
								</label>
							</div>
						</div>
					</div>

					<!-- 换肤 -->
					<div class="title">换肤</div>
					<!-- 默认 -->
					<div class="setings-item default-skin">
						<span class="skin-name ">
							<a href="#" class="s-skin-0">
								默认
							</a>
						</span>
					</div>
					<!-- 蓝色 -->
					<div class="setings-item blue-skin">
						<span class="skin-name ">
							<a href="#" class="s-skin-1">
								蓝色
							</a>
						</span>
					</div>
					<!-- 黄色 -->
					<div class="setings-item yellow-skin">
						<span class="skin-name ">
							<a href="#" class="s-skin-3">
								黄色
							</a>
						</span>
					</div>
				</div>
			</div>
		</div>

		<!-- 创建产品模态框（Modal） -->
		<div class="modal inmodal fade show" id="productCreateModal" tabindex="-1" role="dialog">
			<div class="modal-dialog modal-lg">
				<div class="modal-content">

					<!-- modal-header -->
					<div class="modal-header">
						<button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">×</span><span class="sr-only">Close</span></button>
						<h4 class="modal-title">创建产品</h4>
						<small class="font-bold">副标题副标题副标题</small>
					</div>

					<!-- modal-body -->
					<div class="modal-body">
						<form id="productCreateForm">
							<div class="form-group row"><label class="col-lg-2 col-form-label">名称</label>
								<div class="col-lg-10"><input name="name" type="text" placeholder="请输入产品名称" class="form-control"></div>
							</div>
							<div class="form-group row"><label class="col-lg-2 col-form-label">备注</label>
								<div class="col-lg-10"><input name="remark" type="text" placeholder="请输入备注" class="form-control"></div>
							</div>
						</form>
					</div>

					<!-- modal-footer -->
					<div class="modal-footer">
						<button type="button" class="btn btn-white" data-dismiss="modal">关闭</button>
						<button type="button" class="btn btn-primary" onclick="createProduct()">创建产品</button>
					</div>

				</div>
			</div>
		</div>

		<!-- loadding动画 -->
		<div id="loading" style="display: none">
			<div class="loading">
				<div class="sk-spinner sk-spinner-cube-grid">
					<div class="sk-cube"></div>
					<div class="sk-cube"></div>
					<div class="sk-cube"></div>
					<div class="sk-cube"></div>
					<div class="sk-cube"></div>
					<div class="sk-cube"></div>
					<div class="sk-cube"></div>
					<div class="sk-cube"></div>
					<div class="sk-cube"></div>
				</div>
			</div>
			<div id="floatLayer" class="floatLayer"></div>
		</div>

		<script type="text/javascript">
			$(function() {
				searchProduct();
			});
		</script>
	</body>
</html>
